<template>


    <div class="boxx">
        <div class="box-b">
            <div>
                <h1>
                    {{title}}
                </h1>
            </div>

            <div>
                <vue-markdown  v-highlight>{{text}}</vue-markdown>
            </div>

        </div>
    </div>

</template>

<script>
    import {request} from '../../network/request'

    import 'mavon-editor/dist/css/index.css'
    import VueMarkdown from 'vue-markdown'

    const marked = require('marked')
    import 'highlight.js/styles/github.css'
    import 'github-markdown-css'

    export default {
        name: "lookBlog",
        data(){
          return {
              ans:'',
              msg: '```html \n<form method="GET" action="/transferFunds ">\n cash: <input type="text" name="cash"> \n to: <input type=" text " name=“to"> \n<input type="submit" name="action" value=""> \n</form> \n```',
              text:sessionStorage.getItem('blog'),
              title: sessionStorage.getItem('blogTitle'),
          }
        },
        created() {
            let id = sessionStorage.getItem('blogId');
            id = parseInt(id);


        },
        mounted(){

            console.log(  document.getElementsByTagName("img")[1]);
            document.getElementsByTagName("img")[1].style.width = "900px";
            let strong =  document.getElementsByTagName("strong");
            for(let i = 0; i < strong.length; i++){
                strong[i].style.display = "inline-block";

            }
           let p =  document.getElementsByTagName("p");
           for(let i = 0; i < p.length; i++){
               p[i].style.lineHeight = "25px";
               p[i].style.marginBottom = "5px";
               p[i].style.marginTop = "10px";
           }
           let h2 =  document.getElementsByTagName("h2");
           for(let i = 0; i < h2.length; i++){
               h2[i].style.marginTop = "30px";
               h2[i].style.marginBottom = "10px";
           }
           let li =  document.getElementsByTagName("li");
           for(let i = 0; i < li.length; i++){
               li[i].style.listStyle = "none";

           }



        },
        components:{
            VueMarkdown,
        }

    }

</script>

<style scoped>
    ul li{
        list-style: none;
    }

    .box-b{
        padding: 30px;
        width: 1000px;
        margin: 0 auto;
        background-color: #fff;
    }
    .boxx{
        width: 100%;
        height: 100%;
        background-color: #e8eaf1;
        margin-top: -50px;
        padding-top: 50px;
    }
    .hljs {
        background-color: #282c34 !important;
    }
    .box-b h1{
        margin-left: 0px;
    }

</style>